import React, { Component } from "react";

export default class App extends Component {
  state = {
    todoList: ["吃饭", "睡觉", "打豆豆"], //真实数据
    // todoList: [<li>吃饭</li>, <li>睡觉</li>, <li>打豆豆</li>],  //理想数据
  };
  map() {
    // 把字符串数组 "转换为" JSX数组
    // let arr = []; //JSX数组
    // for (let i = 0; i < this.state.todoList.length; i++) {
    //   arr.push(<li key={i}>{this.state.todoList[i]}</li>);
    // }
    let arr = this.state.todoList.map((item, i) => <li key={i}>{item}</li>);
    return arr; //[<li>吃饭</li>, <li>睡觉</li>, <li>打豆豆</li>]
  }
  render() {
    return (
      <div>
        {/* <ol>{this.state.todoList}</ol> */}
        {this.map()}
      </div>
    );
  }
}
